<template>
  <div class="index-manage">
    <div class="content">
      <div class="summary-table">
        <SummaryTable
          ref="summaryTable"
          :source="tableList"
          :needPeopleAssess="needPeopleAssess"
          :needPlusMinusPoints="needPlusMinusPoints">
          <div slot="search" class="search-box">
            <div class="search-left">
              <div class="search-item">
                <el-select
                  v-model="grainDate"
                  filterable
                  placeholder="请选择"
                  size="small"
                  clearable
                  @change="searchData">
                  <el-option
                    v-for="item in timeList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"></el-option>
                </el-select>
              </div>
              <div class="search-item">
                <div class="item_label" style="min-width: 60px">考核等次:</div>
                <el-select
                  v-model="summaryForm.level"
                  filterable
                  placeholder="请选择"
                  size="small"
                  clearable
                  @change="searchData">
                  <el-option
                    v-for="item in orderOption"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"></el-option>
                </el-select>
              </div>
              <div class="search-item">
                <div class="item_label">部门:</div>
                <el-select
                  v-model="summaryForm.orgId"
                  filterable
                  placeholder="请选择"
                  size="small"
                  clearable
                  @change="searchData">
                  <el-option v-for="item in unitData" :key="item.id" :label="item.orgName" :value="item.id"></el-option>
                </el-select>
              </div>
            </div>
            <div class="search-right">
              <div class="search-item">
                <el-input
                  placeholder="请输入内容"
                  v-model.trim="summaryForm.name"
                  size="small"
                  clearable
                  @keyup.enter.native="searchData">
                  <el-button slot="append" icon="el-icon-search" @click.stop="searchData"></el-button>
                </el-input>
              </div>
            </div>
          </div>
          <div slot="search" class="search-box">
            <div class="search-left">
              <div class="search-item">
                <el-button type="primary" size="small" icon="el-icon-plus" @click.stop="exportClick">导出</el-button>
              </div>
            </div>
            <div class="search-right">
              <div class="search-item">
                <div class="info">
                  <div class="info_list">已完成考核人数 {{ gradeNumObj.totalCount }}人</div>
                  <div class="info_list">好：{{ gradeNumObj.oneCount }}人</div>
                  <div class="info_list">较好：{{ gradeNumObj.twoCount }}人</div>
                  <div class="info_list">一般：{{ gradeNumObj.threeCount }}人</div>
                  <div class="info_list">较差：{{ gradeNumObj.fourCount }}人</div>
                  <div class="info_list">不定等次：{{ gradeNumObj.sixCount }}人</div>
                </div>
              </div>
            </div>
          </div>
          <pagination
            slot="pagination"
            :page-size.sync="pageParam.pageSize"
            :total="pageParam.totalSize"
            :current-page.sync="pageParam.currentPage"
            :pageSizes="[10, 20]"
            layout="slot,prev, pager, next, sizes, jumper"
            @change="onPageChange"></pagination>
        </SummaryTable>
      </div>
    </div>
    <exportListDialog
      ref="exportListDialog"
      :exportShow="exportShow"
      @close="exportShow = false"
      @onExport="onExportSummary" />
  </div>
</template>

<script>
import SummaryTable from './components/SummaryTable'
import pagination from '@com/pagination'
import exportListDialog from '../components/exportListDialog.vue'
import {
  getQuarterAssessPeriods,
  listRankOrgan,
  getAssessCollectResultList,
  getAssessCollectResultCount,
  exportAllAssessFinalData,
} from '@apis/grade.js'
export default {
  name: 'indexManage',
  components: { SummaryTable, pagination, exportListDialog },
  props: {},
  data() {
    return {
      menuInfo: {
        manage: {
          label: '等次管理',
          status: '0',
          queryType: '0',
        },
        summary: {
          label: '等次汇总',
          status: '1',
          queryType: '1',
        },
      },
      activeCode: 'manage',
      oragnList: [],
      searchForm: {
        orgId: '',
        userType: '0',
        level: '',
        name: '',
      },
      analysisInfo: {}, // 统计分析总体数据
      timeList: [],
      grainDate: '',
      orgData: {
        status: '0',
        title: '',
      },
      tableList: [],
      gradeNumObj: {
        rank1Num: 0,
        rank2Num: 0,
        rank3Num: 0,
        rank4Num: 0,
        rank5Num: 0,
        rank6Num: 0,
        totalNum: 0,
        shouldRank1Num: 0,
      },
      orderOption: [],
      isAdminSubmit: 0,
      isOrgMakeSure: 0,
      disabled: false,
      content: [],
      unitData: [],
      pageParam: {
        currentPage: 1,
        pageSize: 10,
        totalSize: 0,
      },
      summaryForm: {
        orgId: '',
        level: '',
        name: '',
      },
      exportShow: false,
      needPeopleAssess: true,
      needPlusMinusPoints: true,
    }
  },
  watch: {
    content: {
      handler(news) {
        this.tableList = news
        const orderOptions = [
          {
            value: '',
            label: '全部',
          },
          {
            value: '1',
            label: '好',
          },
          {
            value: '2',
            label: '较好',
          },
          {
            value: '3',
            label: '一般',
          },
          {
            value: '4',
            label: '较差',
          },
          {
            value: '6',
            label: '不定等次',
          },
        ]
        this.summaryForm.level = this.summaryForm.level || ''
        this.orderOption = orderOptions
      },
      deep: true,
      immediate: true,
    },
  },
  computed: {},
  created() {
    this.getQuarterAssessPeriods()
  },
  mounted() {},
  methods: {
    getQuarterAssessPeriods() {
      getQuarterAssessPeriods().then(res => {
        if (res.status === 200 && res.data.length) {
          const arr = []
          const data = res.data
          for (let i = 0; i < data.length; i++) {
            arr.push({
              value: i,
              label: data[i].periodName,
              quarter: data[i].quarter,
              year: data[i].year,
            })
          }
          this.grainDate = 0
          this.timeList = arr
          this.getUnitData()
        }
      })
    },
    searchData() {
      this.getUnitData()
    },
    // 获取单位搜索项
    async getUnitData() {
      this.unitData = []
      const { data } = await listRankOrgan({
        distinctLevel: '1130',
        tenantId: localStorage.pskh_tenantId,
      })
      this.unitData = [...this.unitData, ...data]
      this.getTabelData()
      this.getAssessCollectResultCount()
    },
    getTabelData() {
      // 获取考核等次列表
      getAssessCollectResultList({
        assessRank: this.summaryForm.level,
        assessType: 'QUARTER',
        keywords: this.summaryForm.name,
        month: '',
        orgId: this.summaryForm.orgId,
        quarter: this.timeList[this.grainDate].quarter,
        year: this.timeList[this.grainDate].year,
        pageNum: this.pageParam.currentPage,
        pageSize: this.pageParam.pageSize,
      }).then(res => {
        this.load = false
        const { pageData = {}, needPeopleAssess = false, needPlusMinusPoints = false } = res.data
        this.needPeopleAssess = needPeopleAssess
        this.needPlusMinusPoints = needPlusMinusPoints
        this.content = [...pageData.content]
        this.pageParam.totalSize = pageData.totalSize
      })
    },
    onPageChange(obj) {
      this.pageParam.currentPage = obj.pageNumber
      this.pageParam.pageSize = obj.pageSize
      this.getTabelData()
    },
    /* 获取统计数据 */
    getAssessCollectResultCount() {
      const param = {
        assessType: 'QUARTER',
        keywords: this.summaryForm.name,
        month: '',
        orgId: this.summaryForm.orgId,
        quarter: this.timeList[this.grainDate].quarter,
        year: this.timeList[this.grainDate].year,
      }
      getAssessCollectResultCount(param).then(res => {
        if (res.status === 200) {
          this.gradeNumObj = res.data
        }
      })
    },
    // 导出
    exportClick() {
      this.exportShow = true
    },
    onExportSummary(str) {
      const req = `?assessRank=${this.summaryForm.level}&keywords=${this.summaryForm.name}&orgId=${
        this.summaryForm.orgId
      }&quarter=${this.timeList[this.grainDate].quarter}&year=${
        this.timeList[this.grainDate].year
      }&containFile=${str}&tenantId=${localStorage.pskh_tenantId}`
      const link = document.createElement('a')
      link.href = exportAllAssessFinalData(req)
      link.target = 'targetName'
      console.log('link.href :>> ', link.href)
      link.click()
      this.exportShow = false
    },
  },
}
</script>
<style lang="scss" scoped>
@import '@styles/layout.scss';
.index-manage {
  height: 100%;
  .content {
    // height: calc(100% - 78px);
    height: calc(100%);
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
    position: relative;
    .search-box {
      width: 100%;
      margin-bottom: 10px;
    }
    .summary-table {
      flex: 1;
      display: flex;
      flex-direction: column;
      .search-item {
        display: flex;
        align-items: center;
        .item_label {
          margin-right: 10px;
        }
      }
    }
  }
}
</style>
